<template>
	<view style="width:100%;">
		<Tabs :tabs="navlist" @change="change"></Tabs>
		<SplitLine :height="14" :marginTop="20"></SplitLine>
		<view class="empty" :style='{height:height+"rpx"}' v-if="list.length==0">
			<Empty mode="list" ></Empty>
		</view>
		<!-- 数据列表 -->
		<scroll-view :style='{height:height+"rpx"}' scroll-y="true" @scrolltolower="scrolltolower" v-if="list.length!=0">
			<view v-for="(item,index) in list" :key="index">
				<List mode="listOne" :Data="item" @click.native="goDetails(item)"></List>
				<SplitLine :height="4" :marginTop="20" :marginBottom="20"></SplitLine>
			</view>
		</scroll-view>
		
	</view>
</template>

<script>
	import SplitLine from "../../components/bw-Split-line/bw-Split-line.vue";
	import Tabs from "../../components/bw-Tabs/bw-Tabs";
	import List from "../../components/bw-lists/bw-lists";
	import Empty from "../../components/bw-Empty/bw-Empty"
	import {articleCategory,articleForCategory} from "../../api/shop.js";
	export default {
		components: {
			 SplitLine,
			 Tabs,
			 List,
			 Empty
		},
		data() {
			return {
				navlist: [],
				current: 0,
				height:0,
				list: [
					    
				],
				pagelist:{},
				scroll_height:0,
			}
		},
		async onLoad() {
			this.getHight()
			console.log(this.shoplist)
			await articleCategory({
				
			}).then(res=>{
				this.navlist= res.data.data
				 // res.data.data.forEach(item=>{
					//  this.tabs.push(item.name)
				 // })
			})
			articleForCategory({
				identify:this.navlist[this.current].identify
			}).then(res=>{
				this.list=res.data.data;
				this.pagelist=res.data
			})
		},
		methods: {
			//获取屏幕高度
			getHight(){
				let that=this
				uni.getSystemInfo({
					success: function (res) {
						 that.height=(res.screenHeight-25-90)*2
					}
				})
			},
			//跳转详情
			goDetails(item){
				uni.navigateTo({
					url:"/pages/Dynamic/dynamicDetails?id="+item.id
				})
			},
			change(e){
				this.current=e.index
				articleForCategory({
					identify:this.navlist[this.current].identify
				}).then(res=>{
					this.list=res.data.data
				})
			},
			scrolltolower() {
				//监听滚动条
				if (this.pagelist.current_page + 1 <= this.pagelist.last_page) {
					this.switchPage(true)
				} else {
					uni.showToast({
						title: "没有更多数据啦",
						icon: "none"
					})
				}
			},
			async switchPage(id) {
				await forCategory({
					identify: this.navlist[this.current].identify,
					page: this.pagelist.current_page + 1
				}).then(res => {
					res.data.list.forEach(item => {
						this.list.push(item)
					})
					//整个数据
					this.pagelist = res.data
				})
			},
		}
	}
</script>

<style scoped lang="less">
	.empty{
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
</style>
